<!-- 需求: 动手实现一个Observer -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
<script>
    // vm == Vue model
    // data是vm里面的data
    let data = {
        title: "标题",
        content: "内容",
        friends: {
            Nico: "dog",
            Meko: "cat",
        },
        hobby: ['唱歌', '跳舞', '打太极'],
    };
    function observe(data){
        // null
        if(!data || typeof data !== 'object') return;
        Object.keys(data).forEach(key=>{
            console.log();
            defineReactive(data,key,data[key])
        })
    };
    function defineReactive(obj,key,value){
        observe(value)
        Object.defineProperty(obj,key,{
            get(){
                console.log('get触发了')
                return value
            },
            set(newVal){
                console.log('set触发了')
                value = newVal;
            }
        })
    }
    observe(data); 
// initState 
</script>
</html>